<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Login</title>
<link rel="stylesheet" href="css/bootstrap.css"/>
<link rel="stylesheet" href="css/bootstrap.min.css"/>
<link rel="stylesheet" href="css/bootstrap-theme.css"/>
<link rel="stylesheet" href="css/bootstrap-theme.min.css"/>
<link rel="stylesheet" href="css/jquery.dataTables.css"/>
<link rel="stylesheet" href="css/login.css">
</head>

<body>
	<div class="modal fade bs-example-modal-sm" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel" aria-hidden="true">
	  <div class="modal-dialog modal-sm">
	    <div class="modal-content">
	    	<div class = "modal-header">
	    		<h4>Processing</h4>
	    	</div>
	    	<div class="modal-body">
	      		<div class="progress progress-striped active">
	   				<div class="progress-bar progress-bar-success" role="progressbar" 
	   					 aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 100%;">
	      				<span class="sr-only">100% Complete</span>
	  				 </div>
				</div>
			</div>
	    </div>
	  </div>
	</div>
	<div class="panel heading">
    		<div class="col-md-12">
            	<div class="col-md-12">
            		<h1>Human Resource Management</h1>
                	<p><b>TPT Cooparation</b><br> 215, Street no.8, Linh Trung, Thủ Đức, Hồ Chí Minh City<br>
                	<b>Hotline:</b>(08)3700 8888 - <b>Fax:</b>0123 456 789 - <b>Email:</b><a href="#">tptcor.@gmail.com</a>
                	</p>
            	</div>

            </div>
    </div>
    <form> 
        <h2 id="lb">Login</h2>
        <label id="lblMesage" style="color: red;"></label>
       	<input type="text" id="username" class="form-control" placeholder="user name"/> 
        <input type="password" id ="password"class="form-control" placeholder="password"/>
        <input type="button" id="submit" value="OK" class="btn btn-primary btn-block" /> 
    </form>
</body>
<script type="text/javascript" src="js/jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="js/jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="js/bootstrap.js"></script>
<script type="text/javascript" src="js/bootstrap.min.js"></script>
<script type="text/javascript" src="js/jquery.dataTables.min.js"></script>
<script type="text/javascript">
	$("#submit").click(function(){
		$.ajax({
			url:"LoginController?action=true&username="+$("#username").val()
					+"&password="+$("#password").val()
					+"&remember="+$("#cbRemember").prop('checked'),
			type:"POST",
			datype:'json',
			success: function(data){
				var responseJson = JSON.parse(data);
				if(responseJson.Login.success){
					window.location.replace(responseJson.Login.location);
				}else{				
					$("#lblMesage").empty();
					$("#lblMesage").text("Don't success! Please, re-enter!");
				}
			},
			error:function(data){
				alert("error");
			}
		});
	});
	
	$(document).ajaxSend(function(event, request, settings) {
			var $modal = $(".bs-example-modal-sm");
	 	   	$modal.modal('show');
		});
		
	$(document).ajaxComplete(function(event, request, settings) {
			var $modal = $(".bs-example-modal-sm");
			$modal.modal('hide');
	});
	
	$( "#password" ).keypress(function( event ) {
		if ( event.which == 13 ) {
			$.ajax({
				url:"LoginController?action=true&username="+$("#username").val()
						+"&password="+$("#password").val()
						+"&remember="+$("#cbRemember").prop('checked'),
				type:"POST",
				datype:'json',
				success: function(data){
					var responseJson = JSON.parse(data);
					if(responseJson.Login.success){
						window.location.replace(responseJson.Login.location);
					}else{				
						$("#lblMesage").empty();
						$("#lblMesage").text("Don't success! Please, re-enter!");
					}
				},
				error:function(data){
					alert("error");
				}
			});
		 }
	});
</script>
</html>
